<!--应付款减少-->
<template>
  <div class="basic_info">
    <div class="info_operation_btn">
      <div class="btn_left">
        <el-button
          :type="[5, 10, 15, 20, 30].includes(orderState) ? 'primary' : ''"
          @click="onNewOreder"
        >新单(N)</el-button>
        <el-button
          v-if="buttonsPermissions.LuRu"
          :disabled="[5, 10, 15, 20, 30].includes(orderState)"
          :class="[5, 10, 15, 20, 30].includes(orderState) ? 'disabled_button' : ''"
          :type="orderState == -1 ? 'primary' : ''"
          @click="onSubmit"
        >保存(S)</el-button>
        <el-button v-else class="disabled_button" disabled>保存(S)</el-button>
        <el-button
          v-if="buttonsPermissions.ShenHe"
          :disabled="[-1, 5, 10, 15, 20, 25, 30].includes(orderState)"
          :class="[-1, 5, 10, 15, 20, 25, 30].includes(orderState) ? 'disabled_button' : ''"
          :type="[0].includes(orderState) ? 'primary' : ''"
          @click="onToExamine"
        >审核(A)</el-button>
        <el-button v-else class="disabled_button" disabled>审核(A)</el-button>
        <el-select v-model="operationValue">
          <el-option
            @click.native="operationSelect(item)"
            v-for="item in operationData"
            :key="item.value"
            :label="item.label"
            :value="item.value"
            :disabled="item.disabled"
            :style="item.disabled ? 'pointer-events: none' : ''"
          ></el-option>
        </el-select>
        <el-button
          :disabled="!buttonsPermissions.DaoRu || (orderState != -1 && orderState != 0)"
          :class="(!buttonsPermissions.DaoRu || (orderState != -1 && orderState != 0)) ? 'disabled_button' : ''"
          @click="importExcel"
        >导入</el-button>
        <!-- <el-select v-model="importValue">
          <el-option
            v-if="buttonsPermissions.DaoRu"
            :disabled="orderState != -1 && orderState != 0"
            label="导入"
            value="导入"
            @click.native="importExcel"
            :style="orderState != -1 && orderState != 0 ? 'pointer-events: none' : ''"
          ></el-option>
          <el-option v-else disabled label="导入" value="导入" style="pointer-events: none"></el-option>
          <el-option
            v-if="buttonsPermissions.DaoChu"
            :disabled="orderState == -1"
            label="导出"
            value="导出"
            @click.native="exportExcel"
            :style="orderState == -1 ? 'pointer-events: none' : ''"
          ></el-option>
          <el-option v-else disabled label="导出" value="导出" style="pointer-events: none"></el-option>
        </el-select> -->
        <el-button
          v-if="buttonsPermissions.DaYin"
          :disabled="orderState == -1"
          :class="orderState == -1 ? 'disabled_button' : ''"
          @click="handleShortcutKeyPrint"
        >打印(P)</el-button>
        <el-button v-else class="disabled_button" disabled>打印</el-button>
        <img
          v-if="orderState == 5"
          style="width: 50px; height: 38px; margin-right: 10px;"
          src="@/assets/shenhe.png"
        />
        <img
          v-else-if="orderState == 10"
          style="width: 57px; height: 43px; margin-right: 10px;"
          src="@/assets/zuofei.png"
        />
        <img
          v-else-if="orderState == 20"
          style="width: 57px; height: 24px; margin-right: 10px;"
          src="@/assets/hongchong.png"
        />
        <span
          v-else
          style="color: #1993fb; margin-right: 10px"
        >{{ getOrderStatusText(orderState) || '未保存' }}</span>
        <!-- <span style="color: #1993fb" v-if="orderState == -1">未保存</span>
        <span style="color: #1993fb" v-else-if="orderState == 0">待审核</span>
        <span style="color: #fd6c21" v-else-if="orderState == 5">已审核</span>
        <span style="color: #ff0000" v-else-if="orderState == 10">已作废</span>
        <span style="color: #ff0000" v-else-if="orderState == 15">已反审</span>
        <span style="color: #ff0000" v-else-if="orderState == 20">已红冲</span>
        <span style="color: #ff0000" v-else-if="orderState == 25">已终止</span>
        <span style="color: #fd6c21" v-else-if="orderState == 30">已完成</span>-->
      </div>
      <div class="btn_right">
        <div style="width:75px;display: flex; justify-content: space-between;" ref="guide8">
          <el-tooltip effect="dark" content="上一条" :enterable="false" placement="top">
            <el-button
              @click="onUpper"
              class="arrow_btn"
              :loading="upperLoading"
              icon="el-icon-arrow-left"
            ></el-button>
          </el-tooltip>
          <el-tooltip effect="dark" content="下一条" :enterable="false" placement="top">
            <el-button
              @click="onLower"
              class="arrow_btn"
              :loading="lowerLoading"
              icon="el-icon-arrow-right"
            ></el-button>
          </el-tooltip>
        </div>

        <div class="search_order">
          <span>单据编号：</span>
          <el-input v-model="queryData.billNumber" disabled></el-input>
        </div>
      </div>
    </div>
    <div class="info_content_div">
      <div class="div_table">
        <div class="div_screen">
          <div class="custom_left bill_mask_back_view">
            <div v-if="maskViewStatus" class="bill_mask_view"></div>
            <!-- 往来单位 -->
            <div class="custom_item">
              <div class="custom_star">
                <div class="custom_label" style="width: auto;min-width:50px;">往来单位</div>
                <span class="star">*</span>
              </div>
              <el-tooltip
                effect="dark"
                :content="getDictTextById(supplierOptions, queryData.companyId, 'companyName')"
                :enterable="false"
                placement="bottom-start"
                :disabled="this.getHideToolTipById(supplierOptions, queryData.companyId, 'companyName')"
              >
                <div class="custom_select_head">
                  <el-select
                    v-model="queryData.companyId"
                    style="width:100%;"
                    filterable
                    @visible-change="(value) => handleFilterMethod('', 'companyName')"
                    :filter-method="(value) => handleFilterMethod(value, 'companyName')"
                    ref="deptSelect"
                    @change="onClickStorehouse"
                    @keydown.native.enter="handleCompanyEnter"
                  >
                    <el-option
                      v-for="item in supplierOptions"
                      :key="item.id"
                      :label="item.companyName"
                      :value="item.id"
                      :disabled="item.status == '1'"
                    ></el-option>
                    <el-option key label value>
                      <div class="custom_add" @click.stop="onShowSupplierAdd">
                        <i class="el-icon-plus"></i>
                        <span>新增</span>
                      </div>
                    </el-option>
                  </el-select>
                  <div class="custom_more">
                    <i class="el-icon-more" @click.stop="onShowSupplier"></i>
                  </div>
                </div>
              </el-tooltip>
            </div>
            <!-- 经手人 -->
            <div class="custom_item">
              <div class="custom_star">
                <div class="custom_label" style="width: auto;min-width:40px;">经手人</div>
              </div>
              <div class="custom_select_head">
                <el-select
                  v-model="queryData.sysUserId"
                  style="width:100%;"
                  filterable
                  @visible-change="(value) => handleFilterMethod('', 'realname')"
                  :filter-method="(value) => handleFilterMethod(value, 'realname')"
                  ref="deptSelect"
                  @keydown.native.enter="handleUserEnter"
                >
                  <el-option
                    v-for="item in jsrOptions"
                    :key="item.id"
                    :label="item.realname"
                    :value="item.id"
                  ></el-option>
                  <el-option key label value>
                    <div class="custom_add" @click.stop="onShowStaffAdd">
                      <i class="el-icon-plus"></i>
                      <span>新增</span>
                    </div>
                  </el-option>
                </el-select>
              </div>
            </div>
          </div>
          <!-- 调整日期 -->
          <div class="custom_item">
            <div class="custom_star">
              <div class="custom_label" style="width: auto;min-width:50px;">调整日期</div>
            </div>
            <div class="custom_select_head_time">
              <el-date-picker
                disabled
                v-model="queryData.commitTime"
                type="date"
                style="height: 30px;"
              ></el-date-picker>
            </div>
          </div>
          <!-- 列配置按钮 -->
          <div class="screen_right" ref="guide9">
            <i @click="onShowColumn()" class="set_up el-icon-s-tools" :size="20"></i>
          </div>
        </div>
        <div class="table_content">
          <div>
            <NewTable
              ref="newTableRef"
              :TableConfig="TableConfig"
              orderType="yfkjs"
              :storehouseId="queryData.xghStorehouseId"
              @onHandleAllPrice="onHandleAllPrice"
              @onCheckStorehouse="onCheckStorehouse"
              @onDeleteRowPlus="onDeleteRowPlus"
              :table-disabled="maskViewStatus"
            ></NewTable>
          </div>
        </div>
        <div class="table_calculation">
          <div class="bill_mask_back_view div_remark">
            <!-- <div v-if="maskViewStatus" class="bill_mask_view"></div> -->
            <span class="span_remark">调整原因</span>
            <span class="star">*</span>
            <el-tooltip :content="queryData.remark" placement="top" :disabled="!queryData.remark">
              <el-input v-model="queryData.remark"></el-input>
            </el-tooltip>
          </div>
          <div>
            <span>制单人：</span>
            <span>{{ queryData.createName }}</span>
            <span class="time">制单日期：</span>
            <span>{{ queryData.createOrderDate }}</span>
            <el-button @click="onShowLog">操作日志</el-button>
          </div>
        </div>
      </div>
    </div>
    <!-- 列配置弹框 -->
    <CConfiguration
      ref="setColumnRef"
      :columnDataArr="getColumnList"
      :defaultColumnDataArr="defaultColumnData"
      orderType="应付款减少"
      @onSaveColumn="onSaveColumn"
    ></CConfiguration>
    <!-- 员工列表查询 -->
    <DialogStaffQuery ref="staffQueryRef" @onSelectStaff="onSelectStaff"></DialogStaffQuery>
    <!-- 新增员工弹框 -->
    <DialogStaffAdd
      ref="staffAddRef"
      @dialogVisibleClose="onCloseAddStaff"
      @onAddSubmit="onAddStaff"
    ></DialogStaffAdd>
    <!-- 操作日志 -->
    <DialogOperationLog :logTitle="logTitle" ref="operationLogRef"></DialogOperationLog>
    <!-- 提醒弹框 -->
    <DialogSimplePrompt ref="simplePrompt" @onSure="onSureSimple"></DialogSimplePrompt>
    <!-- 导入 -->
    <DialogImport
      ref="daoru"
      :titles="TableConfig.columnData"
      :storehouseId="queryData.xghStorehouseId"
      url="/xghShouldCollectionPayChange/xghShouldCollectionPayChange/importExcel"
      :isGoods="true"
      @importData="importData"
      @downloadTemplate="exportExcel"
    ></DialogImport>
    <!-- 选择往来单位弹框 -->
    <DialogSupplier ref="supplierRef" @onSelectSupplier="onSelectSupplier"></DialogSupplier>
    <!-- 新增往来单位弹框 -->
    <DialogSupplierAdd
      ref="supplierAddRef"
      :newData="newData"
      @dialogVisibleClose="onCloseAddSupplier"
      @onAddSubmit="onAddSupplier"
    ></DialogSupplierAdd>
    <!-- 打印 -->
    <dialog-print ref="print"></dialog-print>
     <!-- 反审支付弹框 -->
     <PopupDeApproval ref="deApprovalRef" @onConfirmFree="onUnToExamine"></PopupDeApproval>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'

// 列配置
import CConfiguration from '@/components/c_column/columnConfiguration1'
// 经手人查询
import DialogStaffQuery from '../../components/dialogStaffQuery'
import DialogSimplePrompt from '../../components/dialogSimplePrompt'
import DialogStaffAdd from '../../components/dialogStaffAdd'
import DialogOperationLog from '../../components/dialogOperationLog'
import NewTable from '@/components/c_table/stockBillTable'
import DialogImport from '@/components/c_Import/index1'
import DialogSupplier from '../../components/dialogSupplier'
import DialogSupplierAdd from '../../components/dialogSupplierAdd'
/**打印 */
import dialogPrint from '../../components/dialogPrintStock.vue'
import PopupDeApproval from '../../components/popupDeApproval'
import { getAction, postAction, putAction, downPostFile } from '@/api/manage'
// 导入调用处理权限数据方法
import { handlePermissions, handleOtherPerms, sysConfig, formatMoney, formatPrice, formatNumber, formatFour, delcommafy, handleArrayToObject, handleObjectToArray } from '@/utils/index'
import { cloneObject } from '@/utils/util'
import { getTimeYMD, getTime, getTimeHMS } from '@/utils/DateFormatter'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { ACCESS_TOKEN, TENANT_ID, ACCOUNT_BOOK } from '@/store/mutation-types'
import Vue from 'vue'

export default {
  name: 'billDecreaseInPayable',
  components: {
    CConfiguration,
    DialogStaffQuery,
    DialogStaffAdd,
    DialogOperationLog,
    NewTable,
    DialogImport,
    DialogSimplePrompt,
    DialogSupplier,
    DialogSupplierAdd,
    dialogPrint,
    PopupDeApproval,
  },
  computed: {
    ...mapGetters(['isSupplementOrder']),
    getColumnList () {
      return handleObjectToArray(this.TableConfig.columnData, 'props')
    },
    maskViewStatus () {
      return this.orderState > 0
    },
    buttonsPermissions () {
      return handlePermissions('应付款减少')
    },
    supplementPermissions () {
      return handleOtherPerms('补录单据')
    },
    printPermissions () {
      return handleOtherPerms('单据可多次打印')
    },
    /**单据保存后立即开新单 */
    isSaveNewOrder () { return sysConfig().open_new_order_after_document_saved },
    /**单据保存后立即审核 */
    isSaveExamine () { return sysConfig().verify_order_after_document_saved },
    /**单据审核后立即开新单 */
    isExamineNewOrder () { return sysConfig().open_new_order_after_document_verify },
  },
  mixins: [JeecgListMixin],
  watch: {
    // 路由变化时，更新数据
    $route: {
      immediate: true,
      handler (val) {
        if (val.name === 'adjustmentMemo-adjustmentBill-billDecreaseInPayable') {
          const id = val.params.billId
          if (id && id != this.billId) {
            this.billId = id
            this.getById(this.billId)
          }
        }
      }
    },
    orderState: {
      immediate: true,
      handler () {
        this.handleOperationData()
      }
    },
  },
  data () {
    return {
      // 传递给操作日志的值
      logData: {
        orderId: -1,
        orderType: '应付款减少',
      },
      logTitle: '',
      simpleMark: '',
      operationValue: '操作',
      operationData: [
        {
          value: '作废',
          label: '作废',
          disabled: false,
        },
        {
          value: '反审',
          label: '反审',
          disabled: false,
        },
        {
          value: '红冲',
          label: '红冲',
          disabled: false,
        },
        {
          value: '复制单据',
          label: '复制单据',
          disabled: false,
        },
        {
          value: '办理过程',
          label: '办理过程',
          disabled: false,
        },
      ],
      importValue: '导入',
      // 往来单位列表
      supplierOptions: [],
      newData: {}, // 新增往来单位数据
      // 经手人
      jsrOptions: [],
      // 新增仓库数据
      newWhData: {},
      // 新增经手人数据
      newStaffData: {},
      // 查询条件数据
      queryData: {
        id: '', // 单据id
        billNumber: '', // 单据编号
        companyId: '', // 往来单位ID
        sysUserId: '', //经手人id
        commitTime: '', //调整日期
        remark: '', //调整原因
        createName: '', //制单人
        createOrderDate: '', //制单日期（当前日期）
        billOrderStatus: "",	//单据状态  0.待审核 5.审核通过 10.作废 15.反审 20.红冲 25.终止 30.完成
        orderType: '24',	// 单据类型：21-应收款增加  22-应收款减少  23-应付款增加 24-应付款减少
        isReplacementOrder: '1', // 补单 0-是 1-否 
        totalMoney: 0,// 总金额
      },
      newData: {}, // 新增仓库数据
      // 主表格配置
      TableConfig: {
        // 表头数据
        columnData: {
          idx: {
            isShow: true,
            cellWidth: '70px',
            morenName: '序号',
            zidingyiName: '',
            morenState: true,
            zidingyiState: true,
            noModify: true,
            props: 'idx',
          },
          feeTypeName: {
            isShow: true,
            showType: 'input',
            morenName: '收入名称',
            showLength: true,
            zidingyiName: '',
            morenState: true,
            zidingyiState: true,
            morenSort: 1,
            zidingyiSort: 1,
            noModify: false,
            cellWidth: '20vw',
            props: 'feeTypeName',
          },
          feeMoneyShow: {
            isShow: true,
            showType: 'input',
            morenName: '金额',
            isSum: true,
            sumValue: 0,
            zidingyiName: '',
            morenState: true,
            zidingyiState: true,
            morenSort: 2,
            zidingyiSort: 2,
            noModify: false,
            cellWidth: '20vw',
            props: 'feeMoneyShow',
          },
          remark: {
            isShow: true,
            showType: 'input',
            morenName: '摘要',
            zidingyiName: '',
            morenState: true,
            zidingyiState: true,
            morenSort: 3,
            zidingyiSort: 3,
            noModify: false,
            cellWidth: '40vw',
            props: 'remark',
          },
        },
        // 表格数据
        tableData: [],
      },
      defaultColumnData: [],// 默认列配置
      columnKey: '应付款减少',// 列配置的标识key
      updateId: '', // 修改列配置时返回的id
      pageSize: 1,// 每页条数
      pageNo: 0, // 触发上一单/下一单的状态
      orderTotal: -1,//总页码
      orderFlag: 0,//  上一单1  下一单2
      buttonStatus: 0, // 上一单/下一单状态的判断
      orderState: -1, // 当前单据的执行状态 -1新单 0.待审核 5.审核通过 10.作废 15.反审 20.红冲 25.终止 30.完成
      updateId: '', // 修改列配置时返回的id
      deleteList: [],// 编辑单据删除数据
      insertList: [],// 编辑单据增加数据
      updateList: [],// 编辑单据修改数据
      infoList: [],// 单据原有的数据
      upperLoading: false, // 上一单加载进度
      lowerLoading: false, // 下一单加载进度
      url: {
        exportXlsUrl: '/xghShouldCollectionPayChange/xghShouldCollectionPayChange/exportXls'
      }, // 导出地址
      dataLoading: false, // 数据请求状态
      billId: '',// 单据的id
      printData: {},
      backupsData: {}, //备份单据信息，审核时判断是否修改
    }
  },
  created () {
    // 初始化数据
    this.init()
  },
  methods: {
    // 新增
    handleShortcutKeyAdd () {
      this.onNewOreder()
    },
    // 保存
    handleShortcutKeySave () {
      if (!this.buttonsPermissions.LuRu) {
        this.showTips('未拥有保存权限！')
      } else if (![0, -1].includes(this.orderState)) {
        this.showTips('当前状态不支持保存操作！')
      } else {
        this.onSubmit()
      }
    },
    // 审核
    handleShortcutKeyExamine () {
      if (!this.buttonsPermissions.ShenHe) {
        this.showTips('未拥有审核权限！')
      } else if (this.orderState != 0) {
        this.showTips('当前状态不支持审核操作！')
      } else {
        this.onToExamine()
      }
    },
    // 打印
    handleShortcutKeyPrint () {
      if (!this.buttonsPermissions.DaYin) {
        this.showTips('未拥有打印权限！')
      } else if (this.orderState == -1) {
        this.showTips('当前状态不支持打印操作！')
      } else {
        // 可以多次打印设置
        if (this.printPermissions) {
          this.$refs.print.show(this.printData, this.columnData, this.columnKey)
        } else {
          if (this.$lcStorage.get('printLimitValue')) {
            // 获取打印次数
            this.getPrintNum(this.billId, (() => {
              this.$refs.print.show(this.printData, this.columnData, this.columnKey)
            }))
          } else {
            this.$refs.print.show(this.printData, this.columnData, this.columnKey)
          }
        }
      }
    },
    // 获取数据
    init () {
      // 页面跳转的数据处理
      if (this.$route.params.data) {
        this.$nextTick(() => {
          this.$refs.newTableRef.getSubData()
          this.handleData(this.$route.params.data)
        })
      } else if (this.$route.params.billId) {
        this.$nextTick(() => {
          this.$refs.newTableRef.getSubData()
          this.getById(this.$route.params.billId)
        })
      } else {
        //开新单
        this.onOrederDefault()
      }
      // 往来单位-下拉框初始化
      this.getSupplierOptions()
      // 经手人信息-下拉框初始化
      this.getStaffData()
      // 初始化列配置数据
      this.defaultColumnData = handleObjectToArray(this.TableConfig.columnData)
      this.selectTitle()
    },
    initData () {
      //初始化数据状态
      this.pageNo = 0
      this.orderTotal = -1
      this.orderFlag = 0
      this.billId = ''
      this.logData.orderId = -1
    },
    // 通过ID获取单据
    getById (id) {
      getAction('/xghShouldCollectionPayChange/xghShouldCollectionPayChange/queryById', { id }).then((res) => {
        if (res.code === 200) {
          this.handleData(res.result)
        } else {
          this.$elMessage.error(res.message)
        }
      })
    },
    // 获取往来单位信息
    getSupplierOptions () {
      getAction('/xghCompany/xghCompany/listNoPage', {}).then((res) => {
        if (res.code === 200) {
          this.supplierOptions = res.result
          this.totalCompanys = res.result
        } else {
          this.showTips(res.message, 2)
        }
      })
    },
    // 选择往来单位时触发
    onClickStorehouse (value) {
    },
    // 经手人信息-下拉框初始化
    getStaffData () {
      getAction('/dept/xghAccountBookDept/getAllDeptUsers', {}).then((res) => {
        if (res.code === 200) {
          this.jsrOptions = res.result
          this.totalPersons = res.result
          // 默认经手人设置
          this.queryData.sysUserId = this.$lcStorage.get('xghUser').id
        }
      })
    },
    // 查询保存的列配置
    async selectTitle () {
      let obj = await this.$setColumn.selectColumn(this.columnKey)
      if (obj.code === 200) {
        this.updateId = obj.updateId
        this.TableConfig.columnData = obj.columnData
      } else if (obj.code === 500) {
        let id = await this.$setColumn.addColumn(this.columnKey, handleArrayToObject(this.defaultColumnData, 'props'))
        this.updateId = id
        this.TableConfig.columnData = handleArrayToObject(this.defaultColumnData, 'props')
      } else if (obj.code === 404) {
        this.TableConfig.columnData = handleArrayToObject(this.defaultColumnData, 'props')
      }
    },
    // 修改列配置后保存修改后的值
    async onSaveColumn (value) {
      this.TableConfig.columnData = handleArrayToObject(value, 'props')
      let res = await this.$setColumn.editColumn(this.columnKey, this.TableConfig.columnData, this.updateId)
      if (res.code == 200) {
        this.showTips(res.message, 0)
      } else {
        this.showTips(res.message, 2)
      }
    },
    // 处理操作下拉列表的启用禁用项
    handleOperationData () {
      // 导入导出设置
      if (this.orderState < 5) {
        this.importValue = '导入'
      } else {
        this.importValue = '导出'
      }
      // 重置操作权限
      this.operationData.forEach((item) => {
        item.disabled = true
      })
      // 除了新单，其他的都有复制单据和办理过程
      if (this.orderState != -1) {
        this.operationData[3].disabled = false
        this.operationData[4].disabled = false
      }
      // 0.待审核 5.审核通过 10.作废 15.反审 20.红冲 25.终止 30.完成
      if (this.orderState == 0) {
        // 待审核
        this.operationData[0].disabled = !this.buttonsPermissions.ZuoFei;
      } else if (this.orderState == 5) {
        // 反审和红冲
        this.operationData[1].disabled = !this.buttonsPermissions.FanShen;
        this.operationData[2].disabled = !this.buttonsPermissions.HongChong;
      } else if (this.orderState == 30) {
        // 完成后状态
        this.operationData[2].disabled = !this.buttonsPermissions.HongChong;
      } else if (this.orderState == 25) {
        // 终止后状态
        this.operationData[0].disabled = !this.buttonsPermissions.ZuoFei;
        this.operationData[2].disabled = !this.buttonsPermissions.HongChong;
      }
    },
    isSave () {
      // 判断当前单据的数据是否保存
      if (this.orderState === -1 && (this.queryData.companyId || this.queryData.remark)) {
        return true
      }
      return false
    },
    // 点击开新单
    onNewOreder () {
      // 1.先判断当前页面的值是否保存，用弹出框给用户提醒
      if (this.isSave()) {
        this.simpleMark = 'onNewOreder'
        this.onShowTipsDialog('当前单据还未保存，</br>是否继续？')
      } else {
        this.onOrederDefault()
      }
    },
    onOrederDefault () {
      // 设置新单的默认数据
      this.orderState = -1
      this.queryData = this.$options.data().queryData
      this.queryData.commitTime = getTime()
      this.queryData.createOrderDate = getTime()
      this.queryData.createName = this.$lcStorage.get('xghUser').realname
      // 默认经手人设置
      this.queryData.sysUserId = this.$lcStorage.get('xghUser').id
      this.initData()
      this.onEditClear()
      this.$nextTick(() => {
        this.$refs.newTableRef.getSubData()
      })
    },
    // 保存
    async onSubmit () {
      if (this.dataLoading) {
        this.showTips('请勿重复提交！')
        return
      }
      if (!this.queryData.companyId) {
        this.showTips('往来单位不能为空，请选择！')
        return
      }
      if (!this.queryData.remark) {
        this.showTips('调整原因不能为空，请输入！')
        return
      }
      let summary = ''
      // 校验输入的信息
      for (let i = 0; i < this.TableConfig.tableData.length; i++) {
        const element = this.TableConfig.tableData[i]
        if (element.feeTypeName && delcommafy(element.feeMoney) <= 0) {
          this.showTips('金额必须大于0！')
          return
        }
        // 拼接摘要信息
        summary += `[${element.feeTypeName},${formatMoney(element.feeMoney)}]`
        if (i != this.TableConfig.tableData.length - 1) {
          summary += ';'
        }
      }
      // 转换金额信息
      const newTableData = JSON.parse(JSON.stringify(this.TableConfig.tableData))
      let list = newTableData.map((element) => {
        if (element.feeTypeName) {
          element.feeMoney = delcommafy(element.feeMoney)
          if (this.queryData.id) {
            if (!element.id) {
              this.insertList.push(element)
            } else {
              if (this.isListObj(this.infoList, element)) {
                this.updateList.push(element)
              }
            }
          }
          return element
        }
      }).filter(item => {
        return item != undefined
      })
      if (list.length == 0) {
        this.showTips('必须输入收入名称')
        return
      }
      let queryObj = cloneObject(this.queryData)
      // 给制单人重新赋值
      queryObj.createName = this.$lcStorage.get('xghUser').userName
      // 添加摘要信息
      queryObj.summary = summary
      var res = {}
      // 修改
      if (this.queryData.id) {
        // 先判断用户是否拥有修改权限
        if (this.buttonsPermissions.XiuGai) {
          let obj = {
            ...queryObj,
            insertList: this.insertList,
            deleteList: this.deleteList,
            updateList: this.updateList
          }
          this.setDataLoading()
          res = await putAction('/xghShouldCollectionPayChange/xghShouldCollectionPayChange/edit', obj)
          this.onEditClear()
        } else {
          this.showTips('没有修改权限！')
          return
        }
      } else {
        let obj = {
          ...queryObj,
          infoList: list,
        }
        // 新增
        this.setDataLoading()
        res = await postAction('/xghShouldCollectionPayChange/xghShouldCollectionPayChange/add', obj)
      }
      if (res.code === 200) {
        this.onShowSuccess('单据保存成功！')
        setTimeout(() => {
          this.toSaveOrExamine()
        }, 1500);
        // if (!this.queryData.id) {
        //   this.onUpperOrLower(1)
        // }
        this.handleData(res.result)
      } else {
        this.showTips(res.message, 2)
      }
    },
    // 改变网络请求状态
    setDataLoading () {
      this.dataLoading = true
      setTimeout(() => {
        this.dataLoading = false
      }, 3000);
    },
    isListObj (arr, obj) {
      for (let val of arr) {
        if (val.id == obj.id) {
          for (let key in val) {
            if (val[key] != obj[key]) {
              return true
            }
          }
        }
      }
      return false
    },
    // 单据保存后的走向
    toSaveOrExamine () {
      if (this.isSaveExamine && this.buttonsPermissions.ShenHe) {
        // 保存后立即审核,且有审核权限
        setTimeout(() => {
          this.onToExamine()
        }, 1000)
      } else if (this.isSaveNewOrder && this.buttonsPermissions.LuRu) {
        // 如果保存后立即开新单,并且有新增权限
        this.simpleMark = 'onNewOreder'
        this.onSureSimple()
      }
    },
    afterExamine () {
      // 如果审核后立即开新单
      if (this.isExamineNewOrder && this.buttonsPermissions.LuRu) {
        this.simpleMark = 'onNewOreder'
        this.onSureSimple()
      }
    },
    // 审核单据
    onToExamine () {
      let data = {
        infoList: this.infoList,
        tableConfig: this.TableConfig.tableData,
        queryData: this.queryData
      }
      let n = JSON.stringify(data)
      let b = JSON.stringify(this.backupsData)
      if (n !== b) {
        this.$elMessage.warning('请先保存。')
        return
      }
      this.simpleMark = 'onToExamine'
      this.onShowTipsDialog('确定要审核当前的单据吗？')
    },
    // 操作选择
    operationSelect (value) {
      this.operationValue = '操作'
      switch (value.label) {
        case '作废':
          this.simpleMark = 'onToVoid'
          this.onShowTipsDialog('确定要作废当前的单据吗？')
          break
        case '反审':
          this.simpleMark = 'onUnToExamine'
          this.onShowTipsDialog('确定要反审当前的单据吗？')
          // this.checkReVerifyPermission()
          break
        case '红冲':
          this.simpleMark = 'onToHongC'
          this.onShowTipsDialog('确定要红冲当前的单据吗？')
          break
        case '终止':
          this.simpleMark = 'onToStop'
          this.onShowTipsDialog('确定要终止当前的单据吗？')
          break
        case '完成':
          this.simpleMark = 'onToFinish'
          this.onShowTipsDialog('确定要完成当前的单据吗？')
          break
        case '复制单据':
          this.simpleMark = 'onCopy'
          this.onShowTipsDialog('确定要复制当前的单据吗？')
          break
        case '办理过程':
          this.$refs.operationLogRef.getData(this.logData)
          this.logTitle = '办理过程'
          this.$refs.operationLogRef.dialogVisible = true
          break
        default:
          break
      }
    },
    onSureSimple () {
      switch (this.simpleMark) {
        case 'onNewOreder':
          // 新单 把页面的值都改为初始值
          this.onOrederDefault();
          break;
        case 'onUpper':
          // 上一单
          this.onUpperOrLower(1);
          break;
        case 'onLower':
          // 下一单
          this.onUpperOrLower(2);
          break;
        case 'onToExamine':
          // 审核
          this.onToExamineAudit();
          break;
        case 'onToVoid':
          // 作废
          this.onToVoid();
          break;
        case 'onUnToExamine':
          // 反审
          // this.onUnToExamine();
          this.checkReVerifyPermission()
          break;
        case 'onToHongC':
          // 红冲
          this.onToRedRush();
          break;
        case 'onToStop':
          // 终止
          break;
        case 'onToFinish':
          // 完成
          break;
        case 'onCopy':
          // 复制单据
          this.onCopy(true);
          break;
      }
    },
    // 导入
    importExcel () {
      this.$refs.daoru.dialogVisible = true
    },
    // 导入数据处理
    importData (val) {
      if (val.success) {
        this.showTips('导入成功', 0)
        val.result.forEach((item) => {
          let data = {
            feeTypeName: item.feeTypeName,
            feeMoney: item.feeMoney,
            feeMoneyShow: formatMoney(item.feeMoney),
            remark: item.remark,
          }
          // 替换第一条空数据的商品信息
          if (this.TableConfig.tableData.length == 1 && !this.TableConfig.tableData[0].feeTypeName) {
            this.TableConfig.tableData.splice(0, 1, data)
          } else {
            this.TableConfig.tableData.push(data)
          }
        })
      } else {
        this.showTips(val.message, 2)
      }
    },
    // 导出
    exportExcel () {
      const fileName = '应付款减少' + this.queryData.billNumber
      let params = {
        ...this.queryData,
        fileName
      }
      this.handleExportXlsByStaff(fileName, params)
    },
    // 上一条
    onUpper () {
      if (this.isSave()) {
        this.simpleMark = 'onUpper'
        this.onShowTipsDialog('当前单据还未保存，</br>是否继续？')
      } else {
        this.onUpperOrLower(1)
      }
    },
    // 下一条
    onLower () {
      if (this.isSave()) {
        this.simpleMark = 'onLower'
        this.onShowTipsDialog('当前单据还未保存，</br>是否继续？')
      } else {
        this.onUpperOrLower(2)
      }
    },
    onUpperOrLower (flag) {
      //记录初始的操作
      if (this.orderFlag === 0) {
        this.orderFlag = flag
      }
      if (flag === 1) { // 上一单
        if (this.orderTotal === 0 || (this.orderFlag === 1 && this.pageNo === this.orderTotal) || (this.orderFlag === 2 && this.pageNo === 1)) {
          this.showTips('当前已是第一条数据！')
          return
        }
        this.upperLoading = true
        //需要根据第一次点击的按钮进行选择
        if (this.orderFlag === 1) {
          this.pageNo++
        } else {
          this.pageNo--
        }
      } else { //下一单
        if (this.orderTotal === 0 || (this.orderFlag === 1 && this.pageNo === 1) || (this.orderFlag === 2 && this.pageNo === this.orderTotal)) {
          this.showTips('当前已是最后一条数据！')
          return
        }
        this.lowerLoading = true
        //需要根据第一次点击的按钮进行选择
        if (this.orderFlag === 1) {
          this.pageNo--
        } else {
          this.pageNo++
        }
      }
      this.getOrderData()
    },
    // 打开列配置弹框
    onShowColumn () {
      this.$refs.setColumnRef.dialogVisible = true
    },
    // 审核
    onToExamineAudit () {
      getAction('/xghShouldCollectionPayChange/xghShouldCollectionPayChange/audit', {
        id: this.queryData.id,
      }).then((res) => {
        if (res.code === 200) {
          this.onShowSuccess('审核成功！')
          setTimeout(() => {
            this.afterExamine()
          }, 1500);
          this.handleData(res.result)
        } else if (res.code === 500) {
          this.showTips(res.message, 2)
        }
      })
    },
    // 作废
    onToVoid () {
      getAction('/xghShouldCollectionPayChange/xghShouldCollectionPayChange/cancel', {
        id: this.queryData.id
      }).then((res) => {
        if (res.code === 200) {
          this.onShowSuccess('作废成功！')
          this.handleData(res.result)
        } else if (res.code === 500) {
          this.showTips(res.message, 2)
        }
      })
    },
    // 红冲
    onToRedRush () {
      getAction('/xghShouldCollectionPayChange/xghShouldCollectionPayChange/reverse', {
        id: this.queryData.id,
        operationFlag: 0
      }).then((res) => {
        if (res.code === 200) {
          this.onShowSuccess('红冲成功！')
          this.handleData(res.result)
        } else if (res.code === 500) {
          this.showTips(res.message, 2)
        }
      })
    },
    // 反审
    async onUnToExamine () {
      const res = await getAction('/xghShouldCollectionPayChange/xghShouldCollectionPayChange/reverse', {
        id: this.queryData.id,
        operationFlag: 1
      })
      if (res.code == 200) {
        // 复制单据
        // this.onCopy(false)
        this.onShowSuccess('反审成功！')
        this.handleData(res.result)
      } else if (res.code === 500) {
        this.showTips(res.message, 2)
      }
    },
    // 判断是否有反审权限
    async checkReVerifyPermission() {
      let accountBook = Vue.ls.get(ACCOUNT_BOOK)
      let accountId = accountBook && accountBook.id
      var res = await getAction('/sysConfig/systemConfig/checkReVerifyPermission', {
        xghAccountBookId: accountId
      })
      if (res.success) {
        // this.simpleMark = 'onUnToExamine'
        // this.onShowTipsDialog('确定要反审当前的单据吗？')
        this.onUnToExamine()
      } else {
        this.$refs.deApprovalRef.dialogVisible = true
      }
    },
    onCopy (show) {
      // 复制单据
      this.queryData.id = ''
      this.queryData.billNumber = ''
      this.queryData.billOrderStatus = ''
      this.TableConfig.tableData.forEach(item => {
        item.id = ''
      })
      this.orderState = -1
      this.queryData.createOrderDate = getTime()
      this.queryData.createName = this.$lcStorage.get('xghUser').realname
      this.initData()
      if (show) {
        this.onShowDialogSuccess('单据复制成功')
      }
    },
    onCheckStorehouse (index) {
      if (!this.queryData.companyId) {
        this.showTips('往来单位不能为空，请选择！')
        return
      }
      this.$refs.newTableRef.onShowCommodity(index)
    },
    /**
     * 获取合计列总金额
     * @param value 合计列总金额值
     */
    onHandleAllPrice (value) {
      this.queryData.totalMoney = delcommafy(value)
    },
    /**
     * 获取当前单据数据
     */
    getOrderData () {
      let data = {
        orderType: this.queryData.orderType,
        pageNo: this.pageNo,
        pageSize: this.pageSize,
        orderFlag: this.orderFlag,
        orderId: this.billId || ''
      }
      getAction('/xghShouldCollectionPayChange/xghShouldCollectionPayChange/queryPageList', data).then((res) => {
        this.upperLoading = false
        this.lowerLoading = false
        if (res.code === 200) {
          this.orderTotal = res.result.pages
          this.pageNo = res.result.current
          let list = res.result.records || []
          if (list.length > 0) {
            this.handleData(list[0])
          } else {
            if (this.orderFlag === 1) {
              this.showTips('当前已是第一条数据！')
            } else {
              this.showTips('当前已是最后一条数据！')
            }
            this.pageNo = 0
            this.orderFlag = 0
          }
        }
      }, (error) => {
        this.upperLoading = false
        this.lowerLoading = false
      })
    },
    // 处理请求到的数据
    handleData (res) {
      // 获取订单状态
      this.orderState = Number(res.billStatus)
      this.billId = res.id
      // 给id赋值
      this.logData.orderId = res.id
      if (res.infoList) {
        // 记录原始数据
        this.infoList = cloneObject(res.infoList)
        const tableData = res.infoList
        // 金额转换
        tableData.forEach(item => {
          item.feeMoneyShow = formatMoney(item.feeMoney)
          item.feeMoney = formatFour(item.feeMoney)
        })
        // 增加字段数据，避免不能更新页面
        this.TableConfig.tableData = cloneObject(tableData)
      } else {
        this.infoList = []
        this.TableConfig.tableData = []
        this.$refs.newTableRef.getSubData()
      }
      this.onEditClear()
      // 给筛选项清空后重新赋值
      this.queryData = this.$options.data.call(this).queryData
      // 处理筛选条件的数据
      for (const key in this.queryData) {
        for (const k in res) {
          if (key === k) {
            this.queryData[key] = res[k]
          }
        }
      }
      this.printData = {
        ...this.queryData,
        orderNumber: this.queryData.billNumber,
        companyId_dictText: res.companyId_dictText,
        sysUserId_dictText: res.sysUserId_dictText,
        printExclusive: this.TableConfig.tableData
      }
      if (this.orderState === 0) {
        this.backupsData = {
          infoList: cloneObject(this.infoList),
          tableConfig: cloneObject(this.TableConfig.tableData),
          queryData: cloneObject(this.queryData)
        }
      }
    },
    // 打开经手人分页查询dialog
    onShowStaff () {
      this.$refs.staffQueryRef.dialogVisible = true
    },
    // 打开新增经手人的弹框
    onShowStaffAdd () {
      this.$refs.staffAddRef.dialogVisible = true
    },
    // 获取新增经手人数据
    onAddStaff (val) {
      postAction('/dept/xghAccountBookDept/addAccountBookUser', val).then((res) => {
        if (res.code === 200) {
          this.getStaffData()
          this.$refs.staffAddRef.dialogVisible = false
        } else {
          this.showTips(res.message)
        }
      })
    },
    // 关闭新增经手人时清空
    onCloseAddStaff () {
      this.newStaffData = this.$options.data().newStaffData
    },
    // 打开操作日志弹框
    onShowLog () {
      this.$refs.operationLogRef.getData(this.logData)
      this.logTitle = '单据操作日志'
      this.$refs.operationLogRef.dialogVisible = true
    },
    // 经手人查询子组件选择了经手人，把值付给父组件
    onSelectStaff (val) {
      this.queryData.sysUserId = val.id
    },
    onCloseAddSupplier () {
      this.newData = this.$options.data().newData
    },
    // 新增数据中表格内输入框聚焦时选中
    focusinSelect () {
      event.target.select()
    },
    // 历史记录数据去重并只展示三个数据方法
    selectDataHas (arr) {
      let map = new Map()
      for (const item of arr) {
        if (!map.has(item.id)) {
          map.set(item.id, item)
        }
      }
      let newArr = [...map.values()]
      return newArr.slice(0, 3)
    },
    // 打开新增往来单位弹出框
    onShowSupplierAdd () {
      this.newData = {
        id: '',
        companyName: '',
        companyUserName: '',
        xghCompanyNatureId: '',
        xghCompanyNature: '',
        companyPhone: '',
        companyPinyinCode: '',
        companyLandline: '',
        xghCompanyTypeId: '', //单位类别
        xghCompanyType: '',
        business: '',
        provinceName: '', //省
        provinceCode: '',
        cityName: '', //市
        cityCode: '',
        countyName: '', //区县
        countyCode: '',
        address: '',
        setPrice: '',
        setDiscountPrice: '',
        companyInvoiceStatus: true,
        depositBank: '',
        bankName: '',
        bakCard: '',
        taxNumber: '',
        invoiceAddress: '',
        bankPhone: '',
        companyRAndPStatus: true,
        beginReceivable: 0,
        beginPayable: 0,
        totalReceivable: 0,
        totalPayable: 0,
        receivableQuota: '',
        payableQuota: '',
        receivableTime: '',
        payableTime: '',
        companyRemark: '',
      }
      this.$refs.supplierAddRef.dialogVisible = true
    },
    // 新增往来单位数据
    onAddSupplier (res) {
      this.getSupplierOptions()
    },
    // 打开选择往来单位弹出框
    onShowSupplier () {
      this.$refs.supplierRef.dialogVisible = true
    },
    // 当前选择往来单位数据
    onSelectSupplier (val) {
      this.queryData.companyId = val.id
    },
    // 删除数据
    onDeleteRowPlus (data) {
      if (this.queryData.id && data && data.id) {
        this.deleteList.push(data)
      }
    },
    // 清除数据
    onEditClear () {
      this.insertList = []
      this.deleteList = []
      this.updateList = []
    },
    // 搜索
    handleFilterMethod(value, label) {
      if (label == 'companyName') {
        this.supplierOptions = this.filterMethod(this.supplierOptions, value, label)
      } else if (label == 'realname') {
        this.jsrOptions = this.filterMethod(this.jsrOptions, value, label)
      }
    },
    onShowTipsDialog (msg) {
      this.$refs.simplePrompt.showTwoBtn('el-icon-warning', msg, '是', '否')
    },
    onShowDialogSuccess (msg) {
      this.simpleMark = ''
      this.$refs.simplePrompt.showOneBtn('el-icon-success', msg, '确定')
    },
    onShowSuccess (msg) {
      setTimeout(() => {
        this.$refs.simplePrompt.show({
          index: 0,
          text: msg
        })
      }, 500);
    },
    showTips (msg, type = 1) {
      switch (type) {
        case 0:
          this.$elMessage.success(msg)
          break;
        case 1:
          this.$elMessage.warning(msg)
          break;
        case 2:
          this.$elMessage.error(msg)
          break;
      }
    },
    getOrderStatusText (os) {
      let object = {
        0: '待审核',
        5: '已审核',
        10: '已作废',
        15: '待审核',
        20: '已红冲',
        25: '已终止',
        30: '已完成',
      }
      return object[os + '']
    },
    // 键盘enter事件
    // 客户
    handleCompanyEnter() {
      if (!this.queryData.companyId) {
        this.onShowSupplierAdd()
      }
    },
    // 经手人
    handleUserEnter() {
      if (!this.queryData.sysUserId) {
        this.onShowStaffAdd()
      }
    },
  },
}
</script>

<style lang="scss" scoped>
.basic_info {
  width: 100%;
  height: calc(100vh - 1.875117rem);
  background: #f0f2f5;
  box-sizing: border-box;
  padding: 0 0.168761rem 0.168761rem;
  display: flex;
  flex-direction: column;
}

.info_operation_btn {
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: PingFang SC;
  font-size: 12px;

  ::v-deep .el-button {
    width: 70px;
    height: 30px;
    text-align: center;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    border-radius: 0.093756rem;
    border: none;
    margin-right: 6px;
    margin-left: 0;
  }

  .el-button--default {
    color: #666;
  }

  ::v-deep .el-select {
    height: 30px;
    box-sizing: border-box;
    margin-right: 10px;

    .el-input {
      height: 100%;

      .el-input__inner {
        width: 70px;
        height: 100%;
        border: none;
        font-size: 12px;
      }

      .el-input__suffix {
        height: 100%;
        display: flex;
        align-items: center;
      }

      .el-textarea {
        height: 100%;
        width: 30px;
      }
    }
  }

  ::v-deep .el-checkbox {
    display: flex;
    align-items: center;
    margin-left: 10px;

    .el-checkbox__input {
      height: 19px;
      display: flex;
      align-items: center;
    }

    .el-checkbox__label {
      font-size: 12px;
      padding-left: 5px;
      color: #666;
    }

    .is-checked {
      .el-checkbox__inner {
        background: #1a93fa;
        border-color: #1a93fa;
      }
    }
  }

  .arrow_btn {
    width: 30px;
    height: 30px;
    background: #ffffff;
    padding: 0;
    margin-right: 0;
  }

  p {
    font-size: 12px;
    color: #666;
    margin-right: 0.25rem;
  }

  .search_order {
    display: flex;
    align-items: center;
    margin-left: 10px;

    p {
      margin-right: 0;
    }

    ::v-deep .el-input {
      width: 148px;
      height: 30px;

      .el-input__inner {
        height: 30px;
        line-height: 30px;
        padding: 0 5px;
        font-size: 12px;
        background-color: #ffffff;
        border: none;
        color: #666666;
      }
    }
  }

  .btn_left {
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }

  .btn_right {
    height: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
}

.info_content_div {
  width: 100%;
  height: calc(100% - 1rem);
  background: #fff;
  box-sizing: border-box;
  padding: 0 0.168761rem;
  display: flex;

  .div_table {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    // justify-content: space-between;

    .div_screen {
      width: 100%;
      // heig ht: 50px;
      display: flex;
      justify-content: space-between;
      align-items: center;

      ::v-deep .el-select {
        height: 30px;
        box-sizing: border-box;
        margin-right: 10px;

        .el-input {
          height: 100%;

          .el-input__inner {
            height: 100%;
            font-size: 12px;
          }

          .el-input__suffix {
            height: 100%;
            display: flex;
            align-items: center;
          }

          .el-textarea {
            height: 100%;
            width: 30px;
          }
        }
      }

      ::v-deep .el-date-editor {
        width: 120px;
        height: 30px;

        .el-input__inner {
          width: 100%;
          height: 30px;
          padding: 0 0.187512rem;
          font-size: 12px;
          color: #666;
        }

        .el-input__prefix {
          left: unset;
          right: 5px !important;

          .el-input__icon {
            line-height: 30px;
            font-size: 16px;
          }
        }

        .el-input__suffix {
          display: none;
        }
      }

      .screen_right {
        width: 30px;
        height: 30px;
        margin-top: 15px;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        box-sizing: border-box;

        .set_up {
          line-height: 20px;
          font-size: 20px;
          color: rgb(153, 153, 153);
        }
      }
    }

    .table_content {
      // height: calc(100% - 0.843803rem - 0.25rem - 1.500094rem);
      // margin-top: 0.25rem;
      flex: 1;
      margin-top: 10px;
      box-sizing: border-box;
      overflow: auto;

      > div {
        width: 100%;
        height: 100%;
        border: 1px solid #e3e3e3;
      }
    }

    .table_calculation {
      width: 100%;
      height: 50px;
      box-sizing: border-box;
      padding: 0.187512rem 0;
      display: flex;
      align-items: center;
      justify-content: space-between;

      > div {
        height: 100%;
        display: flex;
        align-items: center;

        ::v-deep .el-button {
          width: 1rem;
          height: 30px;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 12px;
          margin-left: 15px;
        }

        > p,
        > span {
          margin: 0;
          font-size: 12px;
          color: #666;
        }

        .star {
          color: #ff0000;
          font-size: 12px;
          margin-right: 15px;
          margin-left: 6px;
        }

        .time {
          margin-left: 15px;
        }

        > ::v-deep .el-input {
          flex-grow: 1;
          height: 30px;

          .el-input__inner {
            height: 100%;
            padding: 0 0.15rem;
            font-size: 12px;
            color: #666;
          }
        }
      }

      .div_remark {
        flex-grow: 1;
        margin-right: 56px;
      }

      .span_remark {
        width: 60px;
      }
    }
  }
}

.scan_div {
  width: 100%;
  position: relative;
}

.scan_popover {
  position: fixed;
  top: 3.000188rem;
  left: 6rem;
  z-index: 1;
  padding: 0.112507rem;
  background: #fff;
  border: 1px solid #eee;
  display: flex;
  align-items: center;
  box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
  display: none;

  .close_scan {
    position: absolute;
    top: -0.187512rem;
    left: 4.950309rem;
    font-size: 0.337521rem;
    cursor: pointer;
    color: #666;
  }

  ::v-deep .el-input {
    width: 3.375211rem;
    // height: 0.562535rem;
    height: 0.55rem;

    .el-input__inner {
      width: 100%;
      height: 100%;
      border-color: #1893fc;
      border-radius: 0;
      padding: 0 0.112507rem;
    }
  }

  p {
    width: 1.500094rem;
    // height: 0.562535rem;
    height: 0.55rem;
    background: #1893fc;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    // font-size: 0.225014rem;
    font-size: 12px;
    margin: 0;
  }
}

.disabled_button {
  background: #cbced3 !important;
  color: #666 !important;
}

.table_popover {
  .el-table {
    border: 1px solid #e3e3e3;
    box-sizing: border-box;

    th,
    td {
      padding: 0;
      color: #666;
      box-sizing: border-box;
      border-right: 1px solid #e3e3e3;

      .cell {
        // height: 0.562535rem;
        height: 0.55rem;
        display: flex;
        align-items: center;
        // font-size: 0.225014rem;
        font-size: 12px;
      }

      &:first-child {
        .cell {
          justify-content: center;
        }
      }

      &:last-child {
        border-right: none;
      }
    }

    th {
      .cell {
        background: #ededed;
        justify-content: center;
      }
    }

    .el-table__body tr:hover > td {
      background: #e3f6ff;
    }

    .el-table__footer-wrapper {
      td {
        background: #f4f4f4;
        border: none;
      }
    }
  }

  .new_table_style {
    // height: 0.562535rem;
    height: 0.55rem;
    border: 1px solid #e3e3e3;
    border-top: none;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ededed;
  }
}

//
//-------自定义-------
//
.custom_star {
  display: flex;
  align-items: center;
  margin-right: 6px;
}

.star {
  color: red;
  // position: absolute;
  // margin-left: -10px;
}

.bottom_item {
  margin: 30px 0;
  width: 100%;
  text-align: center;
}

.custom_select_head {
  // right: 10px;
  width: 150px;
  height: 100%;
  position: relative;
}

.custom_select_head_time {
  width: 100%;
  height: 100%;
  position: relative;
}

.custom_more {
  position: absolute;
  right: 10px;
  z-index: 10;
  top: 1px;
  background: #fff;
  height: 28px;
  display: flex;
  align-items: center;
  color: #bfbfbf;
}

.custom_add {
  display: flex;
  justify-content: center;
  align-items: center;

  span {
    margin-left: 5px;
    color: #666666;
  }

  i {
    color: #666666;
  }
}

.cus_div {
  display: flex;
  align-items: center;
  margin-left: 5px;
}

.custom_left {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
}

.custom_item {
  display: flex;
  align-items: center;
  height: 30px;
  margin: 15px 13px 0px 0px;
}
</style>